<template>
    <div class="login-wrap">
        <div class="loginTitle">全区街镇整体居民及机构垃圾分类工作管理平台</div>
        <!-- <div class="loginTitle">街镇整体居民及机构垃圾分类工作管理平台</div> -->
        <img src="../../assets/img/login.jpg" alt />
        <div class="ms-login">
            <!-- <div class="ms-title">登陆</div> -->
            <!-- <el-form :model="param" :rules="rules" ref="login" label-width="50px" class="ms-content">
                <el-form-item prop="user" label="账号">
                    <el-input v-model="param.user" placeholder="请输入账号">
                    </el-input>
                </el-form-item>
                <el-form-item prop="pwd" label="密码">
                    <el-input
                        type="password"
                        placeholder="请输入密码"
                        v-model="param.pwd"
                        @keyup.enter.native="submitForm()"
                    >
                        
                    </el-input>
                </el-form-item>
                <div class="login-btn">
                    <el-button type="primary" @click="submitForm()" @keyup.enter='submitForm()' label-width="50px">登录</el-button>
                </div>
            </el-form>-->
            <el-form :model="param" :rules="rules" ref="login" label-width="0px" class="ms-content">
                <el-form-item prop="user">
                    <el-input v-model="param.user" placeholder="请输入账号">
                        <el-button slot="prepend" icon="el-icon-lx-people"></el-button>
                    </el-input>
                </el-form-item>
                <el-form-item prop="pwd">
                    <el-input
                        type="password"
                        placeholder="请输入密码"
                        v-model="param.pwd"
                        @keyup.enter.native="loginAction()"
                    >
                        <el-button slot="prepend" icon="el-icon-lx-lock"></el-button>
                    </el-input>
                </el-form-item>
                <div class="login-btn">
                    <el-button type="primary" @click="loginAction()" @keyup.enter="loginAction()">登录</el-button>
                </div>
            </el-form>
            <!-- <el-form :model="param"  :rules="rules" ref="login" label-width="100px" class="ms-content">
                    <el-form-item label="账号" prop="user">
                      <el-input placeholder="请输入账号" v-model="param.user" clearable></el-input>
                    </el-form-item>
                    <el-form-item label="密码" prop="pwd">
                      <el-input type="password" placeholder="请输入密码" v-model="param.pwd" show-password></el-input>
                    </el-form-item>
                    <el-form-item>
                      <el-button type="primary" @click="submitForm()"  @keyup.enter='submitForm()'>登录</el-button>
                    </el-form-item>
            </el-form>-->
        </div>
    </div>
</template>

<script>
import storage from '../../store/storage';
export default {
  data: function () {
    return {
      param: {
        user: '',
        pwd: '',
      },
      rules: {
        user: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
        pwd: [{ required: true, message: '请输入密码', trigger: 'blur' }],
      },
    };
  },
  mounted () {
    //http://localhost:8080/#/order/Payresult?orderCode=20200721093517378188743943022
    var url = window.location.href; //获取url中"?"符后的字串       
    var cs = url.split('?')[1];                //获取?之后的参数字符串
    //alert(url+'地址');//orderCode=20200721093517378188743943022
    var cc = '';
    var cs2 = '';
    if (cs.length > 0) {
    //   cs = cs.replace('orderId=', '');
      var cc = cs.split('&')[0];//获取orderid
      var cs1 = cs.split('&')[1];//ocd=20200818103843816416953617735
    //   var cs2 = cs1.replace('ocd=', '');//20200818103843816416953617735

      this.submitForm(cs1, cc)
    }
  },
  methods: {
    loginAction () {
      this.submitForm(this.param.user, this.param.pwd)
    },
    async submitForm (idLOGIN, pwLOGIN) {
      var url = this.$url + '/GetLoginUserApi?Username=' + idLOGIN + '&password=' + pwLOGIN
      // var url = 'http://111.160.78.62:5575/GarbagePointsTYApi/BasicData/GetLoginUserApi?Username='+this.param.user+'&&password='+this.param.pwd
      this.$axios({
        // this.$url+'GetLoginUserApi?'+'Username='+this.param.user+'&&'+'password='+this.param.pwd
        url: url,
        method: 'get'
      }).then(res => {
        console.log(res.data)
        if (res.data.IsSucess) {
          this.$message.success('登录成功');
          this.$router.push('/dashboard');
          // storage.set('clentno',res.data.obj.CLIENT_NO)
          // this.$store.commit('clentno',storage.get('clentno'))
          localStorage.setItem('clentno', res.data.obj.CLIENT_NO)
          localStorage.setItem('STREET_NO', res.data.obj.STREET_NO)
          localStorage.setItem('USERNAME', this.param.user)
          localStorage.setItem('ROLEID', res.data.obj.ROLEID)
          localStorage.setItem('USERLEVEL', res.data.obj.USERLEVEL)
          // this.$store.state.clentno = res.data.obj.CLIENT_NO || localStorage.getItem('clentno')
          // console.log(this.$store)s
          // ADDRESS: null
          // CLIENT_NAME: "小店区"
          // CLIENT_NO: "001"
          // EMAIL: null
          // ISUSE: null
          // NAME: "管理员"
          // ORGANIZATION: null
          // PASSWORD: "123456"
          // ROLEID: "8"
          // SEX: null
          // STREET_NO: null
          // TELEPHONE: null
          // TRACK_ID: "1"
          // USERLEVEL: null
          // USERNAME: "admin"

        } else {
          this.$message.error('账号密码错误，请重新输入！')
          return false
        }
      })
    },
  }
}
</script>

<style scoped>
.login-wrap {
    position: relative;
    width: 100%;
    height: 100%;
}
.login-wrap img {
    width: 100%;
    height: 100%;
}
.loginTitle {
    /* margin: 1em 0 0.5em 0; */
    font-weight: 600;
    /* text-transform: uppercase; */
    color: #007acc;
    /* font-style: italic; */
    /* font-family: 'Josefin Sans', sans-serif; */
    font-size: 45px;
    line-height: 54px;
    /* text-shadow: 2px 5px 0 rgba(0,0,0,0.2); */
    text-align: center;
    top: 25%;
    width: 100%;
    height: 100px;
    position: absolute;
    z-index: 2;
}
.ms-title {
    width: 100%;
    line-height: 50px;
    text-align: center;
    font-size: 20px;
    color: #000;
    border-bottom: 2px solid #000;
    font-weight: 600;
}
.ms-login {
    position: absolute;
    left: 50%;
    top: 63%;
    width: 350px;
    margin: -190px 0 0 -175px;
    border-radius: 5px;
    background: #fff;
    border: 2px solid #000;
    opacity: 1;
    overflow: hidden;
}
.ms-content {
    padding: 30px 30px;
}
.login-btn {
    text-align: center;
}
.login-btn button {
    background: #4e6ef2;
    color: #fff;
    width: 100%;
    height: 36px;
    font-size: 18px;
    border: 1px solid #4e6ef2;
    margin-bottom: 10px;
}
.login-tips {
    font-size: 12px;
    line-height: 30px;
    color: #fff;
}
.el-input__inner::-webkit-input-placeholder {
    color: #fff;
    text-align: center;
}
.el-input-group {
    border: 1px solid #3c3c3c !important;
    border-radius: 5px;
}
</style>